Fric-frac Country Views

1. Index
   1. Voor elk item in de lijst voegen we een details link toe naar de ReadingOne pagina met de Id van de op te halen rij uit de Country tabel:

      <tbody>
          @foreach (var item in Model)
          {
              <tr>
                  <td>
                      @item.Name
                  </td>
                  <td>
                      @item.Code
                  </td>
                  <td>
                      <a href="/Country/ReadingOne/@item.Id">Details</a>
                  </td>
              </tr>
          }
      </tbody>

2. InsertingOne (zie Fric-frac Person InsertingOne wireframe omzetten naar HTML)
   1. Het action en het method attribuut van de form moet ingesteld worden op de url naar de InsertOne methode van de CountryController en de methode van het verzenden is post:

      <form class="show-room entity" action="/Country/InsertOne" method="post">

   2. We moeten de gegevens die door de gebruiken zijn ingetypt kunnen doorgeven aan de server. Daarom staat de InsertOne knop in de form en veranderen we het a element in een button van het type submit. Daardoor zal de method en de action van de form gebruikt worden:

      <button type="submit" value="/Country/InsertOne" class="tile">
          <span class="icon-disk"></span>
          <span class="screen-reader-text">Insert One</span>
      </button>

   3. Naam en code zijn verplichte input velden, de beschrijving is een textarea:<

      <fieldset>
          <div>
              <label for="Country-Name">Naam</label>
              <input id="Country-Name" name="Country-Name" type="text" value="" required />
          </div>
          <div>
              <label for="Country-Code">Code</label>
              <input id="Country-Code" name="Country-Code" type="text" value="" required />
          </div>
          <div>
              <label for="Country-Desc">Desc</label>
              <textarea id="Country-Desc" name="Country-Desc"></textarea>
          </div>
      </fieldset>

3. ReadingOne
   1. De ReadingOne heeft geen form element nodig. Alle requests naar de server gebeuren via de querystring en zijn dus get requests.
   2. Voor de DeleteOne en de UpdatingOne geven we de Id mee waarnaar in de tabel gezocht moet worden:

      <div class="command-panel">
          <h2 class="banner">Country</h2>
          <a href="/Country/UpdatingOne/@Model.Id" class="tile">
              <span class="icon-pencil"></span>
              <span class="screen-reader-text">Updating One</span>
          </a>
          <a href="/Country/InsertingOne" class="tile">
              <span class="icon-plus"></span>
              <span class="screen-reader-text">Inserting One</span>
          </a>
          <a href="/Country/DeleteOne/@Model.Id" class="tile">
              <span class="icon-remove"></span>
              <span class="screen-reader-text">Delete One</span>
          </a>
          <a href="/Country/Cancel" class="tile">
              <span class="icon-close"></span>
              <span class="screen-reader-text">Annuleren</span>
          </a>
      </div>

   3. In de fieldset markeren we naam en code als alleen lezen zodat de gebruiker ze niet kan wijzigen

      <fieldset>
          <div>
              <label for="Country-Name">Naam</label>
              <input id="Country-Name" name="Country-Name" type="text" value="@Model.Name" readonly>
          </div>
          <div>
              <label for="Country-Code">Code</label>
              <input id="Country-Code" name="Country-Code" type="text" value="@Model.Code" readonly/>
          </div>
          <div>
              <label for="Country-Desc">Desc</label>
              <textarea id="Country-Desc" name="Country-Desc" readonly>@Model.Desc</textarea>
          </div>
      </fieldset>

4. UpdatingOne
   1. Het action en het method attribuut van de form moet ingesteld worden op de url naar de UpdateOne methode van de CountryController en de methode van het verzenden is post:

      <form class="show-room entity" action="/Country/UpdateOne" method="post">

   2. We moeten de gegevens die door de gebruiken zijn ingetypt kunnen doorgeven aan de server. Daarom staat de InsertOne knop in de form en veranderen we het a element in een button van het type submit. Daardoor zal de method en de action van de form gebruikt worden:

      <button type="submit" class="tile">
          <span class="icon-disk"></span>
          <span class="screen-reader-text">Update One</span>
      </button>

   3. In de fieldset staat er een hidden input om de Id in te bewaren. Deze input heeft een waarde nodig voor het name attribuut omdat die met de post moet worden doorgegeven aan de server. Naam en code zijn verplichte velden. In het value attribuut zetten we de waarden van de name, code en desc eigenschappen die we uit het model ophalen:

      <fieldset>
          <input type="hidden" id="Country-Id" name="Country-Id" value="@Model.Id" />
          <div>
              <label for="Country-Name">Naam</label>
              <input id="Country-Name" name="Country-Name" type="text" value="@Model.Name" required />
          </div>
          <div>
              <label for="Country-Code">Code</label>
              <input id="Country-Code" name="Country-Code" type="text" value="@Model.Code" required />
          </div>
          <div>
              <label for="Country-Desc">Desc</label>
              <textarea id="Country-Desc" name="Country-Desc">@Model.Desc</textarea>
          </div>
      </fieldset>